<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1" />
		<title>徽章-源码健身</title>
	</head>
	<body>
		<div class="app-badge dpflex fdcolumn">
			<p class="top-box ptb10">
				<a href="./user.html"
					><i class="iconfont icon-fanhui cfff mlr15"></i
				></a>
			</p>
			<div class="content-box dpflex fdcolumn flex1">
				<div class="head-num-bg">
					<div class="head-num-box dpflex">
						<div class="title-box flex1 mt16">
							<h2 class="cfff">我的徽章</h2>
							<p class="mt8 f18">MY BADGES</p>
						</div>
						<div class="num-box flex1">
							<h3>今日排名</h3>
							<p class="cfff f68">99</p>
						</div>
					</div>
				</div>

				<div class="badges-box dpflex flex1 pb15">
					<div class="item">
						<img src="../../assets/images/mybadge01.jpg" />
						<p>连续训练天数</p>
					</div>
					<div class="item">
						<img src="../../assets/images/mybadge02.jpg" />
						<p>累计训练天数</p>
					</div>
					<div class="item">
						<img src="../../assets/images/mybadge03.jpg" />
						<p>训练次数</p>
					</div>
					<div class="item">
						<img src="../../assets/images/mybadge04.jpg" />
						<p>跑步次数</p>
					</div>
					<div class="item">
						<img src="../../assets/images/mybadge05.jpg" />
						<p>骑行次数</p>
					</div>
					<div class="item">
						<img src="../../assets/images/mybadge06.jpg" />
						<p>明星圈友</p>
					</div>

					<div class="item">
						<img src="../../assets/images/mybadge07.jpg" />
						<p>评论达人</p>
					</div>

					<div class="item">
						<img src="../../assets/images/mybadge08.jpg" />
						<p>运动铁粉</p>
					</div>

					<div class="item">
						<img src="../../assets/images/mybadge09.jpg" />
					</div>
				</div>
			</div>
			<div class="mask dpflex fdcolumn">
				<p class="top-box ptb10">
					<a href="./user_sports_badge.html"
						><i class="iconfont icon-fanhui cfff mlr15"></i
					></a>
				</p>
				<div class="text-box mt40 flex1">
					<img src="../../assets/images/getbadge01.jpg" />
					<h3 class="text-title ptb20">连续3天徽章</h3>
					<p class="min-text">连续训练3天所得</p>
				</div>
				<p class="text-date">2022.1.10获取</p>
			</div>
		</div>
	</body>
</html>
